<template>
  <v-header @add-item="addItem"></v-header>
  <router-view></router-view>
</template>

<script>
import { useStore } from 'vuex'
import Header from '@/components/header'
import '@/assets/foundation.css'

export default {
  name: 'App',
  components: {
    'v-header': Header
  },
  setup () {
    const store = useStore()
    const addItem = (data) => {
      store.commit('addItem', { title: data.title.value })
    }
    return {
      addItem
    }
  }
}
</script>

<style>
  body {
    background-color: #cccccc;
  }
</style>
